<template>
    <div>登录界面</div>
    <button @click="login">登录</button>
</template>

<script lang="ts" setup>
import { useRouter } from 'vue-router';
import { useStore } from 'vuex';
const router = useRouter();
const store = useStore();
interface MenuType {
    path: string;
    name: string;
    parent: string;
    children?: Array<MenuType>
}
const login = () => {
    const data: Array<MenuType> = [
        { path: '1', name: '首页', parent: '' },
        { path: '1-1', name: '数据可视化', parent: '1' },
        { path: '2', name: '楼盘管理', parent: '' },
        { path: '2-1', name: '新房列表', parent: '2' },
        { path: '2-2', name: '发布新房', parent: '2' },
        { path: '3', name: '内容审核', parent: '' },
        { path: '3-1', name: '楼盘点评', parent: '3' },
        { path: '3-2', name: '楼盘解读', parent: '3' },
        { path: '3-3', name: '买房咨询', parent: '3' },
        { path: '4', name: '咨询管理', parent: '' },
        { path: '4-1', name: '咨询管理', parent: '4' },
        { path: '4-2', name: '发布、编辑咨询', parent: '4' },
        { path: '5', name: '用户管理', parent: '' },
        { path: '5-1', name: '编辑个人用户', parent: '5' },
        { path: '5-2', name: '权限管理', parent: '5' },
    ];
    //扁平化数据的 解构
    for (const item of data) {
        const { path } = item;
        const children = data.filter((it) => it.parent === path);
        if (children.length > 0) item.children = children
    }
    const temarr = data.filter((item) => item.parent === '')
    console.log(temarr)
    //设置全局的menu
    store.commit('setMenu', temarr);
    router.replace('/index');
};

</script>